<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="http://localhost:8080/static/layui/css/layui.css" rel="stylesheet">
</head>
<body>
<form class="layui-form" action="javascript:void(0);" style="width: 50%; margin: 0px auto;">
    <div class="layui-form-item">
        <label class="layui-form-label">用户名</label>
        <div class="layui-input-block">
            <input type="text" name="userName" required  lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">积分</label>
        <div class="layui-input-block">
            <input type="text" name="experience" required  lay-verify="required" placeholder="请输入积分" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">性别</label>
        <div class="layui-input-block">
            <input type="radio" name="sex" value="男" title="男">
            <input type="radio" name="sex" value="女" title="女" checked>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">评分</label>
        <div class="layui-input-block">
            <input type="text" name="score" required  lay-verify="required" placeholder="请输入评分" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">城市</label>
        <div class="layui-input-block">
            <select name="city" lay-verify="required">
                <option value="-1">请选择</option>
                <option value="0">北京</option>
                <option value="1">上海</option>
                <option value="2">广州</option>
                <option value="3">深圳</option>
                <option value="4">杭州</option>
            </select>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">签名</label>
        <div class="layui-input-block">
            <input type="text" name="sign" required  lay-verify="required" placeholder="请输入签名" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">职业</label>
        <div class="layui-input-block">
            <input type="text" name="classify" required  lay-verify="required" placeholder="请输入职业" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label">字数</label>
        <div class="layui-input-block">
            <input type="text" name="words" required  lay-verify="required" placeholder="请输入字数" autocomplete="off" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>

<script src="http://localhost:8080/static/layui/layui.js"></script>
<script src="http://localhost:8080/static/js/jquery-3.6.3.js"></script>
<script>
    //Demo
    layui.use('form', function(){
        let form = layui.form;

        //提交,form表单监听事件
        form.on('submit(formDemo)', function(data){
           // layer.msg(JSON.stringify(data.field));
            $.ajax({
                url : "http://localhost:8080/user/saveTUserinfo.do",
                data : data.field,
                type : "post",
                success:function (res) {
                  //  alert(res);
                    console.log(res);
                    if(res.code == 0){
                        //后端响应给前端结果信息
                        alert(res.msg);
                        layer.msg(res.msg);
                        //添加成功,关闭当前弹窗层
                       let index =  parent.layer.getFrameIndex(window.name);
                       //关闭当前窗口
                        parent.layer.close(index);
                        //刷新当前页面
                        parent.location.reload();
                    }else{
                        alert(res.msg);
                    }

                },
                error:function () {
                    console.log(" form.on('submit(formDemo)' err....");
                }
            });
            //return false;
        });
    });
</script>
</body>
</html>
